import { useEffect, useState } from "react";
 let wk;
function WebWorker() {
    const [inputVal,setInputVal] = useState(0)
    console.log('import.meta.url', import.meta.url);

    useEffect(()=>{
       if(window.Worker) {
          //第1步：创建 worker 实例对象
          // new URL("./worke.js", import.meta.url)
           wk = new Worker(new URL("./worke.js", import.meta.url))
           // 第5步：主线程 监听worker的消息
           wk.onmessage = function (e){
                setInputVal(e.data)
           }
       }

    },[])

    const handleWk = ()=>{
        // 第2步：给worker发送一个消息（数据）
        wk.postMessage('help!')
        console.log('wk',wk);
    }

    return ( <>
        { <input value={inputVal}  type='text'></input> }
        <button onClick={handleWk}>worker</button>
    </> );
}

export default WebWorker;